/*背景渐变
@start  渐变开始颜色
@end  结束颜色
*/
.bg(@start :#00ffff,@end :#9fffff){
    background:-webkit-gradient(linear,0 0, 0 100%,from(@start),to(@end));
    background:-moz-linear-gradient(top,@start ,@end);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=@start ,
    endColorstr=@end ,grandientType=0);
}

/* Mixin */
.transition (@prop: all, @time: 1s, @ease: linear) {
    -webkit-transition: @prop @time @ease;
    -moz-transition: @prop @time @ease;
    -o-transition: @prop @time @ease;
    -ms-transition: @prop @time @ease;
    transition: @prop @time @ease;
}


.bgImg(@imgUrl,@rest...){
    @imgW: image-width(@imgUrl);
    @imgH: image-height(@imgUrl);
    background: url(@imgUrl) no-repeat;
    width: @imgW;
    height: @imgH;
}
.bgImg(@imgUrl,h){
    @imgW: image-width(@imgUrl);
    position: absolute;
    left: 50%;
    margin-left: -@imgW/2;
}
.bgImg(@imgUrl,v){
    @imgH: image-height(@imgUrl);
    position: absolute;
    top: 50%;
    margin-top: -@imgH/2;
}
.bgImg(@imgUrl,hv){
    @imgW: image-width(@imgUrl);
    @imgH: image-height(@imgUrl);
    position: absolute;
    top: 50%;
    margin-top: -@imgH/2;
    left: 50%;
    margin-left: -@imgW/2;
}

.origin(@x,@y) {
    transform-origin: @x @y;
}
.rotate(@deg) {
    transform: rotate(@deg);
}
.skew(@degX,@degY) {
    transform: skew(@degX,@degY);
}
.translate(@x,@y) {
    transform: translate(@x, @y);
}
.scale(@x,@y) {
    transform: scale(@x, @y);
}
.matrix(@a,@b,@c,@d,@e,@f) {
    transform: matrix(@a,@b,@c,@d,@e,@f);
}
.duration(@second){
    animation-duration:@second;
}
.delay(@second){
    animation-delay:@second;
}
.abs{
    position: absolute;
}
.rlv{
    position: relative;
}

.arrow-up(@borderWidth, @color) {
    width:0;
    height:0;
    border-left:@borderWidth solid transparent;
    border-right:@borderWidth solid transparent;
    border-bottom:@borderWidth solid @color;
}

/*箭头向下*/
.arrow-down(@borderWidth, @color) {
    width:0;
    height:0;
    border-left:@borderWidth solid transparent;
    border-right:@borderWidth solid transparent;
    border-top:@borderWidth solid @color;
}

/*箭头向左*/
.arrow-left(@borderWidth, @color) {
    width:0;
    height:0;
    border-top:@borderWidth solid transparent;
    border-bottom:@borderWidth solid transparent;
    border-right:@borderWidth solid @color;
}

/*箭头向右*/
.arrow-right(@borderWidth, @color) {
    width:0;
    height:0;
    border-top:@borderWidth solid transparent;
    border-bottom: @borderWidth solid transparent;
    border-left: @borderWidth solid @color;
}